<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>记录点击-template</title>
    <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<!--template标签的使用为了 使代码更见简洁-->

<div id="case13-demo4">
    <log></log>
</div>
<template id="case13-demo4-tem">
    <div>
        <button v-on:click="click1Count">{{count1}}</button>
        <button v-on:click="click2Count">{{count2}}</button>
    </div>
</template>
<!--局部注册-->
<script type="text/javascript">
    var  case13Demo4=new Vue({
        el:"#case13-demo4",
        components:{
            'log':{
                template:"#case13-demo4-tem",
                data:function () {
                    return{
                        count1:0,
                        count2:0
                    }
                },
                methods:{
                    click1Count() {
                        this.count1++
                    },
                    click2Count() {
                        this.count2++
                    }
                }
            }
        }
    })
</script>
</body>
</html>